<!DOCTYPE html>
<html>
<head>
	<title>注册</title>
	<meta charset="utf-8">
	<meta name = "viewport" content ="initial-scale=1.0,maximum-scale=1,user-scalable=no">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="telephone=no" name="format-detection">
	<link rel="stylesheet" type="text/css" href="/resource/web/css/reset.css">
	<link rel="stylesheet" type="text/css" href="/resource/web/css/login.css">
	<script type="text/javascript" src="/resource/web/js/flexible.js"></script>
	<script type="text/javascript" src="/resource/web/js/jquery-1.11.1.min.js"></script>
</head>
<body>
	<div class="title">
    	<p>注册</p>
		<a href="javascript:;" onClick="javascript :history.back(-1);"><img src="/resource/web/img/newhead/path_7_copy.png"></a>
    </div>
    <div class="register">
		<form action="/Web/register_next" method="post" onsubmit="return check_all()">
			<p>
				<input type="text" name="mobile" id="mobile" placeholder="请输入手机号" >
				<span id="t_mobile"></span>
			</p>
			<p>
				<input type="text"  name="captcha" id="captcha" placeholder="请输入验证码" onblur="check_captcha()">
				<span class="get-num-btn" id="f_captcha">获取验证码</span>
				<span id="t_captcha"></span>
			</p>
			<p class="rg-xieyi"><input class="checkbox" id="check_agree" type="checkbox" name="" checked>我已阅读并同意<span onClick="location.href='/Web/invest_agreement.html'"
				>《钢票网用户注册协议》</span></p>
			{{--<div class="rg-gonext" >下一步</div>--}}
			<input type="submit" value="下一步" class="rg-gonext">
		</form>
    </div>
</body>
</html>

<script>
	if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
		$("#check_agree").css("vertical-align","-0.133333rem");
		//苹果端
	}/* else if (/(Android)/i.test(navigator.userAgent)) {
	 $(".mod-tit").css("display","none");
	 $(".nh-banner").css({
	 "margin-top":"0"
	 })
	} */else {
		//pc端
	};

	//手机号验证
	function check_mobile()
	{
		var mobile = document.getElementById('mobile').value;
		var reg_mobile = /^1[34578]\d{9}$/
		var status = false;
		if(mobile){
			if (reg_mobile.test(mobile)) {
				var ajax = new XMLHttpRequest();
				ajax.onreadystatechange = function () {
					if (ajax.readyState == 4) {
						if (ajax.responseText == 0) {
							status = true
						} else {
							alert('手机号已经注册');
							return false;
						}
					}
				}
				//与服务器建立连接
				ajax.open('post', '/js_verify_register', false);
				ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
				//处理请求
				ajax.send('mobile=' + mobile);
				return status
			} else {
				alert('请输入正确的手机号');
				return false
			}
		}else{
			alert('手机号不能为空');
			return false
		}

	}


	//获取短信验证码

	$('#f_captcha').bind('click',function foo(){
		var mobile = document.getElementById('mobile').value;
		var captcha = document.getElementById('captcha').value;
		if(check_mobile()){
			var wait = 60;
			var int = function fetch_captcha() {
				if (wait == 0) {
					$("#f_captcha").bind("click", foo);
					$('#f_captcha').html('获取验证码');
					clearInterval(a)
					wait = 60;
				}
				else {
					$('#f_captcha').unbind("click", foo);
					$('#f_captcha').html("重新发送(" + wait + ")");
					wait--;
				}
			}
			var a = setInterval(int, 1000);
//				var a = setTimeout(int, 1000);
			$.ajax({
				url: "/get_news_captcha",
				type: "POST",
				data: "mobile=" + mobile,
				success: function (msg) {
					if (msg['code'] == 0) {
//						$("#t_captcha").html("<span style='color:green'>验证码已发送,10分钟内输入有效</span>");
						alert('验证码已发送,10分钟内输入有效');
						$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
						$(".form-code span.code").html("获取短信验证码");
					}else if(!isNaN(msg)){
//						$("#t_captcha").html("<span style='color:red'>"+msg+"秒后可重新发送手机短信验证码"+"</span>");
						alert(msg+'秒后可重新发送手机短信验证码')
						window.clearInterval(a);//停止计时器
						$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
						$(".form-code span.code").html("获取短信验证码");
						return false;
					}else if(msg['code'] == 8||msg['code'] == 9||msg['code'] == 17||msg['code'] == 22){
//						$("#t_captcha").html("<span style='color:red'>您发送验证码过于频繁</span>");
						alert('您发送验证码过于频繁')
						window.clearInterval(a);//停止计时器
						$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
						$(".form-code span.code").html("获取短信验证码");
						return false;
					}else{
//						$("#t_captcha").html("<span style='color:red'>"+msg['detail']+"</span>");
//						$("#t_captcha").html("<span style='color:red'>验证码发送有误,60秒后重新发送</span>");
						alert('验证码发送有误,60秒后重新发送')
						window.clearInterval(a);//停止计时器
						$(".form-code span.code").removeAttr("disabled").css('cursor','pointer');//启用按钮
						$(".form-code span.code").html("获取短信验证码");
						return false;
					}
				}
			});

		}
	})

	//验证验证码
	function check_captcha()
	{
		var news_captcha = document.getElementById('captcha').value;
		var mobile = document.getElementById('mobile').value;
		var status = false;
		if(news_captcha){
			var ajax = new XMLHttpRequest();
			ajax.onreadystatechange = function () {
				if (ajax.readyState == 4) {
					if (ajax.responseText == 1) {
						status = true
					}else if(ajax.responseText == 2){
						alert('验证码已过期');
					}else{
						alert('验证码错误')
					}
				}
			}
			//与服务器建立连接
			ajax.open('post', '/js_verify_register', false);
			ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			//处理请求
			ajax.send('news_captcha=' + news_captcha + '&mobile=' +mobile);
			return status
		}else{
			alert('验证码不能为空')
			return false;
		}
	}

	//检测全部
	function check_all(){
		var chec = document.getElementById("check_agree");
		if(!chec.checked){
			alert('注册为钢票网会员，需同意钢票网用户注册协议。');
			return false
		}
		return (check_mobile()&&check_captcha())
	}
</script>